<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../img/asset-favico.ico">
    <link rel="stylesheet" href="../css/pages-weixinpay.css">
    <link rel="stylesheet" href="../css/webbase.css">
    <title>微信支付</title>
    <script src="../plugins/elementui/index.js"></script>
    <link rel="stylesheet" href="../css/page-health-orderNotice.css" />
    <link rel="stylesheet" href="../plugins/elementui/index.css" />
    <script src="../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/qrcode.min.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../plugins/datapicker/datePicker.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <script src="../plugins/elementui/index.js"></script>
</head>
<body>
<!--引入头部-->
<div class="top-header">
    <span class="f-left"><i class="icon-back" onclick="history.go(-1)"></i></span>
    <span class="center">传智健康</span>
    <span class="f-right"><i class="icon-more"></i></span>
</div>
<div class="container-fluid">
    <div class="cart py-container">
        <!--主内容-->
        <div style="text-align: left">
            <div >
                <div >
                    <span class="name">微信支付</span>
                </div>
                <div >请使用微信扫描二维码支付</div>
                <div ></div>
                <div>
                    <div id="timer"  style="padding-bottom: 40px" ></div>
                    <div class="fl code">
                        <div id="qrCode"></div>
                        <script>
                            let qrCode = new QRCode('qrCode','${pay_url}');
                        </script>
                    </div>
                </div>
                </div>
        </div>

    </div>
</div>
<script>
    var codeUrl = getcodeUrl("codeUrl")
    var id = getUrlParam("id");
    let qrCode = new QRCode('qrCode',{
        text:codeUrl,
        width:250,
        height:250,
        // colorLight: '#e21918',
        // colorDark: '#0078d7',
        correctLevel: QRCode.CorrectLevel.M
    });
</script>
<script>
    var oBox= document.getElementById('timer');
    var maxtime = 1 * 60 * 15;
    function CountDown() {
        if (maxtime >= 0) {
            minutes = Math.floor(maxtime / 60);
            seconds = Math.floor(maxtime % 60);
            msg = "支付剩余时间" + minutes + ":" + seconds + "秒";
            oBox.innerHTML = msg;
            if (maxtime == 5 * 60)alert("还剩5分钟");
            --maxtime;
        } else{
            clearInterval(timer);
            alert("时间到，订单关闭!");
            //location.href="http://www.baidu.com"
        }
    }
    timer = setInterval("CountDown()", 1000);
</script>
<script>
    var vue = new Vue({
        el:"#app",
        data:{
            order:{}
        },
        created(){
            setInterval(()=>{
                axios.get("/order/IsPaidByOrderId.do?id="+id).then((res)=>{
                    console.info(res.data.data.price)
                    if (res.data.flag) {
                        this.order = res.data.data
                        if (res.data.data.isPaid == 1){
                            this.$message.success("支付成功")
                            location.href="orderSuccess.html"
                            return;
                        }
                    }
                })
            },1000),
                setTimeout(()=> {
                    location.href="setmeal.html"
                },30000)
        },
        methods:{

        }

    })
</script>
</body>
</html>